<!-- 常见问题 -->
<template>
  <view>
    <aster-back
      v-show="isUnDef(props.showBack) || props.showBack"
      font-color="#333"
      :show-title="true"
      title="常见问题"
    />
    <view class="border-radius margin-top-sm">
      <aster-list-title title="猜你想问" iconfont="" rightIcon="" :size="32" fwt="bold" />
      <aster-list-title
        v-for="(item, index) in question?.guess"
        :title="item.title"
        iconfont=""
        @goto="to_detail(item.id)"
        :key="index"
      />
    </view>
    <view class="border-radius margin-top-sm">
      <aster-list-title title="常见问题" iconfont="" rightIcon="" :size="32" fwt="bold" />
      <aster-list-title
        v-for="(item, index) in question?.common"
        :title="item.title"
        iconfont=""
        @goto="to_detail(item.id)"
        :key="index"
      />
    </view>
  </view>
</template>
<script setup lang="ts">
  import AsterBack from '@/components/common/aster-back.vue';
  import AsterListTitle from '@/components/common/aster-list-title.vue';
  import { ResultEnum } from '@/enums/httpEnum';
  import { getQuestionList } from '@/services/api/question/question';
  import { FAQModel } from '@/services/model/questionModel';
  import config from '@/utils/config';
  import { isUnDef } from '@/utils/is';
  import { router } from '@/utils/router';
  import { onLoad } from '@dcloudio/uni-app';
  import { ref } from 'vue';

  const props = defineProps({
    showBack: {
      type: Boolean,
      default: () => true,
    },
  });

  const question = ref<FAQModel>();

  onLoad(() => {
    getQuestionList().then(({ data }) => {
      if (data.code == ResultEnum.SUCCESS) question.value = data.data;
    });
  });

  const to_detail = (id?: number) => {
    router.push(config.route.question_detail + '?id=' + id);
  };
</script>
<style lang="scss" scoped>
  page {
    padding: 0 20rpx;
  }
</style>
